<template>
  <div>
    <!-- Tabbar.vue -->
    上半部分的内容
    <mt-tabbar v-model="selected">
      <mt-tab-item id="sy">首页
        <img slot="icon" :src="require(`../assets/main_${selected=='sy'?1:0}.png`)" alt="">
      </mt-tab-item>
      <mt-tab-item id="gwc">购物车
          <img slot="icon" v-if="selected=='gwc'" src="@/assets/cart_1.png" alt="">            
          <img slot="icon" v-else src="@/assets/cart_0.png" alt="">            
      </mt-tab-item>
      <mt-tab-item id="wd">我的
          <img slot="icon" v-if="selected=='wd'" src="@/assets/me_1.png" alt="">
          <img slot="icon" v-else src="@/assets/me_0.png" alt="">
      </mt-tab-item>
    </mt-tabbar>
  </div>
</template>
<script>
export default {
  data() {
    return {
      selected: 'sy'
    }
  },
}
</script>
